<!DOCTYPE html>
<html lang="zh">

<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
	<title><%= htmlWebpackPlugin.options.title %></title>

</head>

<body>
	<div class="header">
		<h1>赛博朋克2077 VGbaike</h1>

		<div class="operator-btn-box hide">
			<button type="button" id="prev" class="z-button z-button--primary"><!----><!----><span>上一步</span></button>	
			<!-- <button type="button" id="save" class="z-button z-button--primary save "><span>下载图片</span></button> -->
			<button type="button" id="filter" class="z-button z-button--primary "  ><!----><!----><span>下一步</span></button>	
		</div>
	</div>
	<div class="conntent">
		<input type="file" id="uploadInput" style="width: 0;height: 0;" accept="image/x-png,image/gif,image/jpeg,image/bmp"> 
		<div id="drop_area">
			<div>
				<p>拖拽文件到这里或</p>
				<p>ctrl+v</p>
			</div>
			<div  style="cursor: pointer;">点击这里上传</div>
		</div>
	</div>
	<!-- <footer>

	</footer> -->
	<div id="container" > 
		
	</div>

	<div style="text-align: center;padding-top: 50px;padding-bottom: 50px;" class="checkLanguage">
		<div class="radio-group" id="checkLanguage" >
			<label role="radio" class="radio-button"><input type="radio" class="radio-button__orig-radio" checked
					value="zh"><span class="radio-button__inner">中文</span></label>
			<label role="radio" class="radio-button"><input type="radio" class="radio-button__orig-radio"
					value="en"><span class="radio-button__inner">English</span></label>
		</div>
	</div>
<div class="filterImg">
	<!-- <img  id="createImg"> -->
	<!-- <div><img></div> -->
</div>
	<div class="filterBox">
		<div class="filterLayer">
			<img src="./static/img/loding.gif">
			<!-- <div class="loadEffect">
				<span></span>
				<span></span>
				<span></span>
				<span></span>
				<span></span>
				<span></span>
				<span></span>
				<span></span>
		</div> -->
		</div>
		<div>

		</div>
		<!-- <div class="filter-container">
			<div class="close"><button type="button"  class="z-button z-button--primary"><span>关闭</span></button>	</div>
			<div class="title">
				<h3>提示！</h3>
				<p>添加滤镜后将无法对图层进行操作</p>
			</div>
			<div class="operation">
				<button type="button" data-type="RGB" class="z-button z-button--primary "><span>RGB</span></button>	
				<button type="button"  data-type="Mask"  class="z-button z-button--primary "><span>Mask</span></button>	
				<button type="button"  data-type="Invert" class="z-button z-button--primary "><span>Invert</span></button>	
			</div>
			<div>
				<div class="operation-input RGB-input hide">
					<div>红色：<input value="0" min="0"  max="255" type="range" class="RGBred"></div>
					<div>蓝色：<input value="0" min="0" max="255" type="range" class="RGBblue"></div>
					<div>绿色：<input value="0" min="0" max="255" type="range" class="RGBgreen"></div>
					<div>不透明度：<input value="0" min="0" max="10" type="range" class="RGBalpha"></div>
				</div>
				<div class="operation-input Mask-input hide">
					<div>值：<input value="0" min="0"  max="300" type="range" class="MaskThreshold"></div>
				</div>
				<div class="operation-input Invert-input hide">
				</div>
			</div>
		</div> -->
	</div>
	<div  style="text-align: center;">
		<button  type="button" id="moreFilter" class="z-button z-button--primary hide"  style="margin: 25px 0;"><!----><!----><span>更多</span></button>	
	</div>
	
	 <div style="display: none;">
	  <img src="./static/img/VGBAIKE-01.svg" id="vgLogoImg">
	  <img src="./static/img/cyberpunk_en.png" id="cyberpunkImgEN">
	  <img src="./static/img/cyberpunk_zh.png" id="cyberpunkImgZH">

	</div>
	<script type="text/javascript" src="./static/js/jquery-3.2.1.min.js"></script>
</body>
<script>
</script>
</html>